<template>
  <div>
    <el-dialog
      title="上架"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose"
    >
      <span class="demonstration">上架商品数量:{{shop.shopUpnum}}</span>
      <span style="color: red">{{msg}}</span>
      <el-slider :disabled="state" v-model="shop.shopUpnum" :max="max"></el-slider>
      <span slot="footer" class="dialog-footer">
    <el-button @click="cancel">取 消</el-button>
    <el-button type="primary" @click="isUp" :disabled="state">确 定</el-button>
 </span>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name: "UpShopNum",
    data() {
      return {
        state:false,
        msg:"",
        max:0,
        dialogVisible: false,
        shop: {id: "", isUp: "", shopUpnum: 0},
      }
    },
    methods: {
      handleClose(done) {
        //模态框的关闭
        this.$confirm("确认关闭？")
          .then((_) => {
            this.cancel();
          })
          .catch();
      },
      cancel(){
        this.max=0;
        this.shop={};
        this.dialogVisible=false;
      },
      getUpNum() {
        //  查询仓库的数量
        this.$axios
          .get("warehouseInfo/upNumByShopId.action/"+this.shop.id)
          .then(res=>{
            if (res.data.code>0){
              this.max=res.data.num;
              this.state=false;
              this.msg='';
            }else{
              this.msg=res.data.msg;
              this.state=true;
            }
          })
          .catch(err=>{this.$message.error(err)})
      },
      isUp() {
        if (this.shop.shopUpnum==0){
          this.$message.warning("请选择上架数量")
          return
        }
        this.$axios
          .put("shop/shop.action", this.shop)
          .then(res => {
            if (res.data.code > 0) {
              this.$message.success(res.data.msg);
              this.$parent.getShopData();
              this.dialogVisible = false;
            } else {
              this.$message.error(res.data.msg)
            }
          })
          .catch(err => alert(err))
      }

    }
  }
</script>

<style scoped>

</style>
